<template>
    <div class = "announcement">
        <!--标题-->
        <div class = "announcement_title">
            <span>{{title}}</span>
        </div>
        <!--时间-->
        <div class = "announcement_time">
            <span>{{time}}</span>
        </div>
        <!--内容主体-->
        <div class = "announcement_content">
            <span>{{info}}</span>
        </div>
    </div>
</template>

<script>
    export default {
        name: "announcement",
        data() {
            return {
                title:'',
                info:'',
                time:''
            }
        },
        created() {
        },
        mounted(){
          this.getMsgDetails();
        },
        methods: {
            getMsgDetails(){
                var url = '/api/home/message/notice';
                var param = {
                    id: this.$route.query.id
                };
                this.$util.postRequestInterface(url,param,(res)=>{
                    this.title = res.data.title;
                    this.info = res.data.info;
                    this.time = this.$moment(res.data.create_time*1000).format('YYYY-MM-DD HH:mm:ss')
                })
            }
        }
    }
</script>

<style scoped lang = "scss">
    .announcement {
        /*标题*/
        .announcement_title {
            width: 80%;
            margin: 2rem auto;
            text-align: center;
            span {
                font-size: 2rem;
                color: #333333;
            }
        }

        /*时间*/
        .announcement_time {
            width: 80%;
            margin: 0 auto;
            text-align: center;

            span {
                font-size: 1.3rem;
                color: #999999;
            }
        }

        /*内容*/
        .announcement_content {
            width: 95%;
            margin: 1rem auto;
            text-align: center;
            text-indent: 2rem;

            span {
                font-size: 1.4rem;
                color: #333333;
                font-weight: 500;
            }

        }
    }
</style>